<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<%@ include file="/WEB-INF/views/include/constrant.jsp"%>
<!DOCTYPE html>
<html>
<head>
		<meta charset="UTF-8">
		<title>订单详情</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="${ctxStatic }/wx/mui/css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="${ctxStatic }/wx/css/xiaketotal.css" />
		<script src="${ctxStatic }/wx/mui/js/mui.min.js"></script>
		<script src="${ctxStatic }/zepto/zepto.min.js"></script>
		<script type="text/javascript" charset="utf-8">
      		mui.init();
    	</script>
	</head>
<body >
	<header class="mui-bar mui-bar-nav" style="background: #16c59b;">
	    <a href="${ctxWx}/orders/orderList" 
	    	class="mui-icon mui-icon-left-nav mui-pull-left">
	    </a>
	    <h1 class="mui-title">订单详情</h1>
	</header>
		 <div class="mui-content" style="background: #F5F5F5;height: 100%;">
       	   <div class="order-a">
       	   	   <p class="order-ex" id="title"></p>
       	   	   <div class="order-a-box">
       	   	   	   <ul class="mui-table-view"></ul>
       	   	   </div>
       	   </div>
       </div>
       <nav class="mui-bar mui-bar-tab" style="background: #fff;" id="nav">
           <div class="mui-col-xs-6 nav-btns" id="btn1">
           	    <a style="border: 0;" id="btnLeft"  ></a>
           </div>
           <div class="mui-col-xs-6 nav-btns" id="btn2">
           	     <a id="cancelBtn" style="color: #999;"  ></a>
           </div>
       </nav>
   <script type="text/javascript">
		mui.init()
		$(function(){
			
			//从前一个页面获取到的订单id
			var orderid = "${orderid}";
			if (orderid != '' && orderid != null) {
				mui.post('${ctxFront}/mobile/getOrderDetail',{orderid:orderid},function(d){
					var sm = d.data.orders;
					var money = "0";
					if (d.data.cuponsInfo!=null) {
						money = d.data.cuponsInfo.money;
					}
					var total = Number(sm.dueamount)+Number(money);
					var cg = d.data.cargotype;
					var table = document.querySelector(".mui-table-view");
					document.getElementById('title').innerText = sm.ordername;
					var div = document.createElement("div");
					var orderStatus = "";
					var buttonClass = "";
					//订单状态,0=已支付,1=未支付,2=已取消,9=已作废
					var btn1 = document.getElementById('btnLeft');
					var btn2 = document.getElementById('cancelBtn');
					if (sm.orderstatus==0) {
						orderStatus = "已支付";
						btn1.innerHTML = '再来一单';
						btn2.innerHTML = '退单';
						btn1.style.background ="#16c59b";
						document.getElementById("btnLeft").addEventListener('tap', function() {
							window.location.href = "${ctxWx}/pu/index";
						});
						$("#cancelBtn").attr("href","${ctxWx}/orders/backMoneyPage?orderid=${orderid}"); 
					} else if(sm.orderstatus==1){
						orderStatus = "未支付";
						btn1.innerHTML = '去支付';
						btn2.innerHTML = '取消';
						btn1.style.background ="#f7b04d"; 
						document.getElementById("btnLeft").addEventListener('tap', function() {
							window.location.href = "${ctxWx}/pu/pay/payWay?orderid="+orderid;
						});
						document.getElementById("cancelBtn").addEventListener('tap', function() {
						var btnArray = ['否', '是'];
						mui.confirm('是否取消该订单？', function(e) {
							if (e.index == 1) {//点击确认
								mui.post('${ctxFront}/mobile/cancelOrder',{orderid:'${orderid}'},function(d){
									var code = d.code;
									if (d.code=='200') {//取消订单成功
										mui.alert(d.message,function(){
											window.location.href = "${ctxWx}/orders/orderList";
										})
									} else{
										mui.alert(d.message);
									}
								})
							} else {  //点击取消
							}
						})
					});
					} else if(sm.orderstatus==2){
						orderStatus = "已取消";
						document.getElementById('nav').style.visibility="hidden";
					}else if(sm.orderstatus==9){
						orderStatus = "已作废";
						document.getElementById('nav').style.visibility="hidden";
					}
					var dateStr = getLocalTime(sm.departdate);
					var str = "";
					str += '<li class="mui-table-view-cell listatxs">';
       	   	   	    str += '           <div class="mui-col-xs-5">订单金额:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">';
       	   	   	    str += '          	     <span style="float: left;">'+total+'</span>';
       	   	   	    str += '          	     <span style="float: right;padding-right: 20px;">';
   	   	   	    	if(sm.useCupons=='1'){
   	   	   	    		str += '<font>优惠￥'+money+'</font>';
   	   	   	    	}
       	   	   	    str += '           	     </span>';
       	   	   	    str += '           </div>';
       	   	   	    str += '       </li>';
       	   	   	    str += '      <li class="mui-table-view-cell listatxs">';
       	   	   	    str += '           <div class="mui-col-xs-5">实际支付:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">'+sm.dueamount+'</div>';
       	   	   	    str += '       </li>';
       	   	   	    str += '       <li class="mui-table-view-cell listatxs">';
                    str += '            <div class="mui-col-xs-5">订单日期:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">'+sm.createDate+'</div>';
       	   	   	    str += '       </li>';
       	   	   	    str += '       <li class="mui-table-view-cell listatxs">';
                    str += '            <div class="mui-col-xs-5">订单状态:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">'+orderStatus+'</div>';
       	   	   	    str += '       </li>';
       	   	   	    str += '       <li class="mui-table-view-cell listatxs">';
                    str += '            <div class="mui-col-xs-5">出发时间:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">'+dateStr+'</div>';
       	   	   	    str += '       </li>';
       	   	   	    str += '       <li class="mui-table-view-cell listatxs">';
                    str += '            <div class="mui-col-xs-5">包车天数:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">'+sm.bookingdays+'天</div>';
       	   	   	    str += '       </li>';
       	   	   	    str += '       <li class="mui-table-view-cell listatxs">';
                    str += '            <div class="mui-col-xs-5">车辆数:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">'+sm.purchasenum+'</div>';
       	   	   	    str += '       </li>';
       	   	   	    str += '       <li class="mui-table-view-cell listatxs">';
                    str += '           <div class="mui-col-xs-5">品牌:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">'+cg.typedesc+'</div>';
       	   	   	    str += '       </li>';
       	   	   	    str += '       <li class="mui-table-view-cell listatxs">';
                    str += '            <div class="mui-col-xs-5">上车地点:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">'+sm.boardaddr+'</div>';
       	   	   	    str += '       </li>';
       	   	   	    str += '       <li class="mui-table-view-cell listatxs">';
                    str += '            <div class="mui-col-xs-5">联系人姓名:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">'+sm.contacts+'</div>';
       	   	   	    str += '       </li>';
       	   	   	    str += '       <li class="mui-table-view-cell listatxs">';
                    str += '            <div class="mui-col-xs-5">联系电话:</div>';
       	   	   	    str += '           <div class="mui-col-xs-7">'+sm.payertel+'</div>';
       	   	   	    str += '       </li>';
       	   	   	    if (sm.ordertype==2 || sm.ordertype=='c') {   //按天包车,定制包车才有行程备注
       	   	   	    str += '       <li class="mui-table-view-cell listatxs">';
                    str += '            <div class="mui-col-xs-5">行程备注:</div>';
                    /*if (sm.ordertype=='c') {
                    	 str += '  <div class="mui-col-xs-7">'+d.data.tDemands.modeldesc+'</div>';
                    } else{
                    }*/
                    str += '  <div class="mui-col-xs-7">'+sm.remarks+'</div>';
                    str += '       </li>';
       	   	   	    } 
       	   	   	    div.innerHTML = str;
                	table.appendChild(div);
				})
			}
		});
		function getLocalTime(nS) {  
		var date = new Date();  
	    date.setTime(nS);  
	    var y = date.getFullYear();      
	    var m = date.getMonth() + 1;      
	    m = m < 10 ? ('0' + m) : m;      
	    var d = date.getDate();      
	    d = d < 10 ? ('0' + d) : d;      
	    var h = date.getHours();    
	    h = h < 10 ? ('0' + h) : h;    
	    var minute = date.getMinutes();    
	    var second = date.getSeconds();    
	    minute = minute < 10 ? ('0' + minute) : minute;      
	    second = second < 10 ? ('0' + second) : second;     
	    return y + '-' + m + '-' + d+' '+h+':'+minute+':'+second;      
		}
	</script>
</body>
</html>